<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
	<meta charset="utf-8" />
	<title>{$Think.lang.tol_page_sms} - {$Think.lang.cfg_website}</title>
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
	<meta content="" name="description" />
	<meta content="" name="author" />
	<!-- BEGIN GLOBAL MANDATORY STYLES -->
	<link href="{$NOW_THEME_URL}/Assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/plugins/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/css/style-metro.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/css/style.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/css/style-responsive.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/css/statistics_style.css" rel="stylesheet" type="text/css"/>
	<link href="{$NOW_THEME_URL}/Assets/css/themes/{:session('skin')}.css" rel="stylesheet" type="text/css" id="style_color"/>
	<!-- END GLOBAL MANDATORY STYLES -->
	<!-- BEGIN PAGE LEVEL STYLES -->
	<!-- END PAGE LEVEL STYLES -->
	<link rel="shortcut icon" href="favicon.ico" />
</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body class="page-header-fixed">
	<!-- BEGIN HEADER -->
	<include file="Public:header" />
	<!-- END HEADER -->
	<!-- BEGIN CONTAINER -->
	<div class="page-container">
		<!-- BEGIN SIDEBAR -->
		<div class="page-sidebar nav-collapse collapse">
			<!-- BEGIN SIDEBAR MENU -->        
			<ul class="page-sidebar-menu">
            	<li>
					<!-- BEGIN SIDEBAR TOGGLER BUTTON -->
					<div class="sidebar-toggler hidden-phone"></div>
					<!-- BEGIN SIDEBAR TOGGLER BUTTON -->
				</li>
                {$menu_tree}
            </ul>
			<!-- END SIDEBAR MENU -->
		</div>
		<!-- END SIDEBAR -->
		<!-- BEGIN PAGE -->
		<div class="page-content">
			<!-- BEGIN SAMPLE PORTLET CONFIGURATION MODAL FORM-->
			<div id="portlet-config" class="modal hide">
				<div class="modal-header">
					<button data-dismiss="modal" class="close" type="button"></button>
					<h3>portlet Settings</h3>
				</div>
				<div class="modal-body">
					<p>Here will be a configuration form</p>
			  </div>
			</div>
			<!-- END SAMPLE PORTLET CONFIGURATION MODAL FORM-->
			<!-- BEGIN PAGE CONTAINER-->
			<div class="container-fluid">
				<!-- BEGIN PAGE HEADER-->   
			  <div class="row-fluid">
					<div class="span12">
                    	<div class="clear">&nbsp;</div>                        
						<ul class="breadcrumb">
							<li>
								<i class="icon-home"></i>
								<a href="__APP__">{$Think.lang.cfg_page_home}</a> 
								<span class="icon-angle-right"></span>
							</li>
							<li>
								<a href="__URL__">{$Think.lang.tol_page_total}</a> 
								<span class="icon-angle-right"></span>
						  </li>
							<li><a href="#">{$Think.lang.tol_page_sms}</a></li>
						</ul>
					</div>
				</div>
				<!-- END PAGE HEADER-->
				<!-- BEGIN PAGE CONTENT-->
				<div class="row-fluid">
					<div class="span12">
						<!-- BEGIN VALIDATION STATES-->
						<div class="portlet box purple">
							<div class="portlet-title">
								<div class="caption"><i class="icon-plus"></i>{$Think.lang.tol_page_sms}</div>
								<div class="tools">
									<a href="javascript:;" class="collapse"></a>
								</div>
							</div>
							<div class="portlet-body form">
							<!--曲线图盒子开始-->
							<div class="row-fluid" style="padding-bottom:10px;">
							
							<div class="btn-group" style="margin-bottom:0px !important;">
								<button data-toggle="dropdown" class="btn green dropdown-toggle" id="xuanze">{$Think.lang.tol_page_num}<i class="icon-angle-down"></i></button>
								<ul class="dropdown-menu">
									<li><a href="#" class="num" rel="sms_num">{$Think.lang.tol_page_num}</a></li>
									<li><a href="#" class="status" rel="sms_status">{$Think.lang.tol_page_status}</a></li>
								</ul>
							</div>
								<include file="Total:tongjitu" /> 
								
			                <!--曲线图盒子结束-->
			                </div>
							</div>
							
						</div>
						<!-- END VALIDATION STATES-->
					</div>
				</div>
				<!-- END PAGE CONTENT-->         
		  </div>
			<!-- END PAGE CONTAINER-->
		</div>
		<!-- END PAGE -->
	</div>
	<!-- END CONTAINER -->
	<!-- BEGIN FOOTER -->
	<include file="Public:footer" />
	<!-- END FOOTER -->
	<!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
	<!-- BEGIN CORE PLUGINS -->
	<script src="__PUBLIC__/Js/jquery.min.js" type="text/javascript"></script>
	<script src="{$NOW_THEME_URL}/Assets/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>      
	<script src="{$NOW_THEME_URL}/Assets/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
	<!--[if lt IE 9]>
	<script src="{$NOW_THEME_URL}/Assets/plugins/excanvas.min.js"></script>
	<script src="{$NOW_THEME_URL}/Assets/plugins/respond.min.js"></script>  
	<![endif]-->  
	<script src="{$NOW_THEME_URL}/Assets/plugins/jquery.cookie.min.js" type="text/javascript"></script>
	<script src="{$NOW_THEME_URL}/Assets/scripts/app.js"></script>
	<script src="__PUBLIC__/Plugins/Highcharts/js/highcharts.js"></script>
	<script src="__PUBLIC__/plugins/datepicker/WdatePicker.js"></script>
	<script src="__PUBLIC__/Plugins/Highcharts/js/exporting.js"></script> 
	<script type="text/javascript">
	
	var ABS_URL_Theme = "{$NOW_THEME_URL}/";
	var ABS_URL       = "{$Think.TMPL_URL}/";
	var REL_URL       = "{$Think.REL_URL}";
	var urls = '{:U("Total/chart_sms")}';
	var str  = '<i class="icon-angle-down">';
	var types = 'sms_num';
	
	jQuery(document).ready(function() {   
	   App.init();
	   
	   createChart(urls);
	   
	   $('.num').on('click',function(){
		   $('#xuanze').html($('.num').html()+str);
		   types = $('.num').attr('rel');
	   });
	   $('.status').on('click',function(){
		   $('#xuanze').html($('.status').html()+str);
		   types = $('.status').attr('rel');
	   });
		
	   $('.day_search').each(function(){
			
			$(this).bind("click",function(){
				var num  = $(this).attr("num");
				var type = $(this).attr("type");
				var url = urls+"&num="+num+"&type="+type+"&types="+types;
				createChart(url);
			});
		});
		
		$('.date_search').bind("click",function(){
			var start = $.trim($('#start_time').val());
			var end   = $.trim($('#end_time').val());
			var type  = $.trim($('#type_search').val());
			if(start && end){
				var url = urls+"&func=timepart&type="+type+"&start="+start+"&end="+end+"&types="+types;
				createChart(url);
			}else{
				alert("{$Think.lang.tol_page_pxzsj}");
			}
		});
		$('#type_search').bind("change",function(){
			var start = $('#type_search').find("option:selected").attr("start");
			var end   = $('#type_search').find("option:selected").attr("end");
			$('.start_time').val("");
			$('#start_time').attr("onfocus",start);
			$('#end_time').attr("onfocus",end);
		});
		
		
	});
	
	function createChart(url){
		var result = $.get(url,
			function(data){
				$('#container').highcharts(data);
		},'json');
	}
	</script>
	<!-- END JAVASCRIPTS -->   
</body>
<!-- END BODY -->
</html>